import React from 'react';
import Nav from 'react-bootstrap/lib/Nav'
import NavItem from 'react-bootstrap/lib/NavItem'
import ConfigManageTab from './configManage.jsx'
import BuildManagementTab from './buildManagement.jsx'
import BuildResultTab from './buildResult.jsx'


var BuildManageTab = React.createClass({
    getInitialState: function () {
        return ({
            activeTab:0,
            current_project:this.props.project
        });
    },
    componentWillReceiveProps (newprops){
        this.setState({
            current_project:newprops.project
        });
    },

    _getTabView(){
        let tabView = null;
        let index = this.state.activeTab;
        switch(index){
            case 0: tabView = <ConfigManageTab current_project={this.props.project}/>;break;
            case 1: tabView = <BuildManagementTab  current_project={this.props.project}/>;break;
            case 2: tabView = <BuildResultTab current_project={this.props.project}/>;break;
        }
        return tabView;
    },

    _handleTabSelect(selectedKey){
        switch(selectedKey){
            case 0: this.setState({activeTab:0});break;
            case 1: this.setState({activeTab:1});break;
            case 2: this.setState({activeTab:2});break;
        }
    },
    render() {
        return (

            <div style={{width:"100%",height:"100%"}}>
                <div className="tab">
                    <div className="tab_nav">
                        <div className={"tab_navItem tab_navItemFirst " + (this.state.activeTab==0?"tab_active":"")} onClick={this._handleTabSelect.bind(this, 0)}>
                            <span>产品配置</span>
                            <div className="tab_triangle_border_down">
                                <span></span>
                            </div>
                        </div>
                        <div className={"tab_navItem tab_navItemCenter " + (this.state.activeTab==1?"tab_active":"")} onClick={this._handleTabSelect.bind(this, 1)}>

                            <span>构建配置</span>
                            <div className="tab_triangle_border_down">
                                <span></span>
                            </div>
                        </div>
                        <div className={"tab_navItem tab_navItemLast " + (this.state.activeTab==2?"tab_active":"")} onClick={this._handleTabSelect.bind(this, 2)}>

                            <span>构建结果</span>
                            <div className="tab_triangle_border_down">
                                <span></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div  className="tab_content">
                    {this._getTabView()}
                </div>
            </div>


        );
    }
});

export default BuildManageTab;
